<template>
  <el-form ref="cardForm">
    <el-table border :data="bankList" v-loading="loading">
      <el-table-column prop="name" label="用户姓名">
      </el-table-column>
      <el-table-column prop="bankName" label="名称">
      </el-table-column>
      <el-table-column prop="cardNo" min-width="300" label="银行卡号">
        <template slot-scope="{row,$index}">
          <span>{{ row.cardNo | bankNumber}}</span>
        </template>
      </el-table-column>
      <el-table-column prop="address" min-width="200" label="银行卡开户行">
      </el-table-column>
      <el-table-column label="操作">
        <template slot-scope="{row}">
          <el-button type="text" @click="()=>delBankCard(row)">申请删除</el-button>
        </template>
      </el-table-column>
    </el-table>
    <div style="padding: 10px 0" v-if="bankList.length>0">
      <el-button type="danger" size="mini" @click="updateBankCard">申请重置</el-button>
    </div>
  </el-form>

</template>

<script>
  import {getMemberBankList} from '@/services/api/member'
  import {form} from '@/build'

  export default {
    name: "edit-bank-card",
    mixins: [form],
    data() {
      return {
        loading: false,
        bankList: [],
        filters: {
          userId: this.$store.state.member.member_id
        }
      }
    },
    mounted() {
      this.bindGet(getMemberBankList, 'bankList', {
        sendingData: 'filters',
        format:(data)=>{
          return _.filter(data,['status', 0]);
        }
      })
      this.getAll()
    },
    methods: {
      cancelEdit(row) {
        row.edit = false
        this.$message({
          message: '取消修改',
          type: 'warning'
        })
      },
      delBankCard(row){
        this.$store.commit(types.SHOW_APPLY_MODAL, {data: row, from: 'delCard'})
      },
      updateBankCard() {
        this.$store.commit(types.SHOW_APPLY_MODAL, {data: this.filters, from: 'resetName'})
      },
    }

  }
</script>

<style scoped>
  .edit-input {
    padding-right: 100px;
  }

  .cancel-btn {
    position: absolute;
    right: 15px;
    top: 10px;
  }
</style>
